<template>
  <div>
    <!-- Footer Start -->
    <div class="flex-grow-1"></div>
    <section class="footer_wrap" id="footer-wrap">
      <b-container>
        <b-row class="row">
          <b-col md="3" class="mb-4">
            <div class=" o-hidden text-left">
              <div class="">
                <h4 class="card-title font-weight-bold">Dexam</h4>
                <p class="">
                  Dexam is highly customizable  Pure Vue JS + bootstrap 4 landing
                  Page. Dexam is built with official Vue CLI tool and uses
                  Bootstrap Vue  .
                </p>
              </div>
            </div>
          </b-col>
          <!-- end of col -->
          <b-col md="3" class="mb-4">
            <div class=" o-hidden text-left">
              <div class=" ">
                <h4 class="card-title font-weight-bold">Other Pages</h4>
                <div class=" mb-5 lead">
                  <ul class="list-inline">
                    <li class=" mb-3 "><a href="#">Marketing</a></li>
                    <li class=" mb-3 "><a href="#">Campaign</a></li>
                    <li class="mb-3"><a href="#"> Digital Agency</a></li>
                  </ul>
                </div>
              </div>
            </div>
          </b-col>
          <!-- end of col -->
          <b-col md="3" class="mb-4 mb-lg-0 mb-md-0">
            <div class=" o-hidden text-left">
              <div class="">
                <h4 class="card-title font-weight-bold">Awesome Features</h4>
                <div class=" mb-5 lead">
                  <ul class="list-inline">
                    <li class=" mb-3 ">
                      <i class="eva eva-checkmark-outline mr-2 text-warning"></i
                      >Minimal
                    </li>
                    <li class=" mb-3 ">
                      <i class="eva eva-checkmark-outline mr-2 text-warning"></i
                      >Intuitive
                    </li>

                    <li class="mb-3">
                      <i
                        class="eva eva-checkmark-outline mr-2 text-warning"
                      ></i>
                      Super Flexible
                    </li>
                  </ul>
                </div>
              </div>
            </div>
          </b-col>
          <!-- end of col -->
          
          <b-col md="3" class="mb-lg-0 mb-md-0">
            <div class=" o-hidden text-left">
              <div class="">
                <h4 class="card-title font-weight-bold">Contact Info</h4>
                <div class="address-wrap mb-3">
                  <ul class="list-group list-unstyled">
                    <li class="">
                      <i class="eva eva-pin-outline mr-2"></i>UI-Lib ,United
                      Kingdom
                    </li>
                  </ul>
                </div>
                <div class="address-wrap mb-3">
                  <ul class="list-group list-unstyled">
                    <li class="">
                      <i class="eva eva-email-outline mr-2"></i>test@yahoo.com
                    </li>
                  </ul>
                </div>

                <div class="address-wrap mb-3">
                  <ul class="list-group list-unstyled">
                    <li class="">
                      <i class="eva eva-phone-call-outline mr-2"></i>
                      +8801961081993
                    </li>
                  </ul>
                </div>

                <section class="social-wrap ">
                  <div class="social-btns-wrap">
                    <a class="social-btn text-30 facebook ml-0" href="#"
                      ><i class="eva eva-facebook"></i
                    ></a>

                    <a class="social-btn text-30 twitter" href="#"
                      ><i class="eva eva-twitter"></i
                    ></a>

                    <a class="social-btn text-30 google" href="#"
                      ><i class="eva eva-google"></i
                    ></a>
                  </div>
                </section>
              </div>
            </div>
          </b-col>
          <!-- end of col -->
        </b-row>
      </b-container>
    </section>
  </div>
</template>
